<template>
  <div>
    <el-form :inline="true">
      <el-select v-model="ruleForm" placeholder="按订单号查询">
        <el-option label="按订单号查询" value="shanghai"></el-option>
      </el-select>
      <el-form-item>
        <el-input placeholder="订单号" v-model='index'></el-input>
      </el-form-item>
      <el-form-item>
          <el-button @click='search'>查询</el-button>
      </el-form-item>
    </el-form>
    <el-table :data="list" style="width: 100%" border>
      <el-table-column
        prop="orderNo"
        label="订单号"
        width="180"
      ></el-table-column>
      <el-table-column
        prop="receiverName"
        label="用户"
        width="180"
      ></el-table-column>
      <el-table-column
        prop="statusDesc"
        label="订单状态"
        width="180"
      ></el-table-column>
      <el-table-column prop="createTime" label="创建时间"> </el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <router-link :to="{path:'/details?id='+scope.row.orderNo}"><el-button >查看</el-button></router-link>
          
        </template>
      </el-table-column>
    </el-table>
    <!-- 分页器 -->
    <pagination
      :total="total"
      @size="handleSizeChange"
      @num="handleCurrentChange"
      v-show='status'
    ></pagination>
  </div>
</template>
<script>
import pagination from "./component/pagination";
import { order_list } from "@/api/api";
import { order_search } from "@/api/api";

export default {
  name: "",
  components: { pagination },
  props: [],
  data() {
    return {
      pageNum: 1,
      list: [],
      ruleForm: "",
      total: 0,
      index:'',
      status:true,
    };
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {
    this.order();
  },
  methods: {
    async order() {
      const { data: res } = await order_list(
        `/api/order/list.do?pageNum=${this.pageNum}`
      );
      this.list = res.data.list;
      this.total = res.data.total;
    },
    handleSizeChange(val) {
      this.pageSize = val;
      this.order();
    },
    handleCurrentChange(val) {
      this.pageNum = val;
      this.order();
    },
    // 订单搜索
    async search(){
      const {data:res} = await order_search(`/api/order/search.do?listType=search&pageNum=1&orderNo=${this.index}`)
      this.list = res.data.list;
      this.status = !this.status
    },
    
  },
};
</script>
<style scoped>
</style>